import variables from '@/styles/element-variables.scss'
import defaultSettings from '@/settings'
import router from '@/router'
import screenfull from 'screenfull'

const { showSettings, tagsView, fixedHeader, sidebarLogo ,hideAllSideBar} = defaultSettings

const state = {
  theme: variables.theme,
  showSettings: showSettings,
  tagsView: tagsView,
  fixedHeader: fixedHeader,
  sidebarLogo: sidebarLogo,
  hideAllSideBar:hideAllSideBar,
  index:0,
}

const mutations = {
  CHANGE_SETTING: (state, { key, value }) => {
    // eslint-disable-next-line no-prototype-builtins
    if (state.hasOwnProperty(key)) {
      state[key] = value
    }
  },
  CHANGE_SCREENSTATE: (state, data) => {
   state.hideAllSideBar=data
    // console.log('要变化：', state.hideAllSideBar);
  }
}

const actions = {
  changeSetting({ commit }, data) {
    commit('CHANGE_SETTING', data)
  },
  changeScreenSate({ commit }, data) {
     // console.log('要变化了：',data);
    commit('CHANGE_SCREENSTATE', data)
  },
  rollList({ commit }, data) {
    roll(data);
  },
}

// 滚动
function roll(data) {
  //监听当前页面是否处于全屏状态决定是否停止该方法
  if(!screenfull.isFullscreen){
    return;
  }
  //判断url页面是否仅有一个，决定是否循环跳转
  if(data.length>1){
    //判断自增的数组下标是否超过数组长度来控制循环
    if(state.index <= data.length-1){
      //跳转路由
      router.push(`${data[state.index].url}`);
      //根据设置时长跳转
      setTimeout(() => {
        roll(data);
      }, `${data[state.index].showTime}`*1000);
      state.index = state.index + 1;
    }else{
      state.index = 0;
      roll(data);
    }
  }else{
    router.push(`${data[state.index].url}`);
  }
}

export default {
  namespaced: true,
  state,
  mutations,
  actions,
}
